<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title>图库列表</title>
    <link rel="icon" href="favicon.ico" type="image/ico">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="author" content="yinqi">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/materialdesignicons.min.css" rel="stylesheet">
    <link href="css/style.min.css" rel="stylesheet">

</head>

<body>
<div class="lyear-layout-web">
    <div class="lyear-layout-container">
        <!--左侧导航-->
        <script type="text/javascript" src="js/jquery-3.5.1.min.js"></script>
        <div class="headerpage"></div>
        <script>
            $(".headerpage").load("header.html");
        </script>

        <!--End 左侧导航-->



        <!--页面主要内容-->
        <main class="lyear-layout-content">



            <div class="container-fluid">

                <div class="row">
                    <div class="col-lg-12">
                        <div class="card">
                            <div class="card-body">

                                <div class="masonry-grid" data-provide="photoswipe" id="picWall">


<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/1.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/5.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/2.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/3.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/4.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/9.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/6.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/7.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/8.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/10.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/11.jpg" alt="The selected child description">-->
<!--                                    </a>-->

<!--                                    <a class="masonry-item" href="#">-->
<!--                                        <img src="images/gallery/13.jpg" alt="The selected child description">-->
<!--                                    </a>-->

                                    <div class="masonry-item" href="#">
                                        <button onclick="" class="btn btn-danger btn-xs"> 删除()</button>
                                        <img src="images/gallery/14.jpg" alt="The selected child description">
                                    <div/>



                                </div>

                                <script>
                                    function  del(username0) {
                                        console.log(username0)
                                        $.ajax({

                                            url: "./delPic/"+username0,
                                            type: "GET",
                                            dataType: "json",
                                            success: function(result) {
                                                data1=result;
                                                console.log("del success")
                                                aa()
                                            },
                                            error:function (result) {
                                                data1=result;
                                                console.log(result);
                                                alert("删除失败,权限不够")


                                            }
                                        });
                                    }




                                    function aa() {
                                        $.ajax({
                                            url: "./selectAllPic",
                                            type: "POST",
                                            success: function(result) {
                                                console.log(result)
                                                result=JSON.parse(result);
                                               let tstr=``;
                                                result.forEach(e=>{
                                                    tstr=tstr+`<a class="masonry-item" href="#">
                                        <button onclick="del(${e.id})"> 删除</button>
                                                   <img src="${e.picurl}" alt="MypicWall">
                                    </a>`
                                                })
                                                console.log(tstr)
                                                $("#picWall").html(tstr)
                                            },
                                            error:function (result) {
                                                console.log("false")
                                            }
                                        })
                                    }

                                    $(aa())
                                </script>

                            </div>
                        </div>
                    </div>

                </div>

            </div>

        </main>
        <!--End 页面主要内容-->
    </div>
</div>

<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/perfect-scrollbar.min.js"></script>


</body>
</html>